<template>
  <div class="component component--layout layout--C1">
    <header class="header header--secondary">
      <h2 class="title">
        <a class="link" href="">{{ taxCont.title }}</a>
      </h2>

      <p class="paragraph">{{ taxCont.desc }}</p>
    </header>
    <!-- taxes.vue   399行 taxes -->
    <div class="column column--primary">
      <div class="element element--article MarketWatchcom" v-for="(item, index) in props.taxesData" :key="index">
        <figure class="article__figure">
          <router-link class="figure__image"
            :to="{ name: 'NewDetail', params: { uuid: item.uuid, author: item.author } }">
            <img class="lazyautosizes" :src="item.imgUrl" v-if="item.imgUrl" />
            <img class="lazyautosizes" src="../../../assets/noimg.png" v-else />
          </router-link>
        </figure>
        <div class="article__content">
          <h3 class="article__headline">
            <router-link class="link" :to="{ name: 'NewDetail', params: { uuid: item.uuid, author: item.author } }">
              {{ item.title }}
            </router-link>
          </h3>
        </div>
      </div>
    </div>
  </div>
</template>
<script lang="ts" setup>
const props = defineProps(['taxesData', 'taxCont'])
</script>
<style lang="scss" scoped></style>